﻿<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>首页</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <script src="../CCMobile/js/jquery.js" type="text/javascript"></script>
    <link href="/CCMobile/css/icons.css" rel="stylesheet" />
    <!--通用JS-->
    <script src="../CCMobile/Scripts/QueryString.js" type="text/javascript"></script>
    <script src="../CCMobile/Scripts/config.js" type="text/javascript"></script>
    <script src="../CCMobile/Comm/Gener.js" type="text/javascript"></script>

    <!--mui的引用-->
    <link href="../CCMobile/css/index2.css" rel="stylesheet" type="text/css" />
    <link href="../CCMobile/js/mui/css/mui.min.css" rel="stylesheet" type="text/css" />
    <script src="../CCMobile/js/mui/js/mui.min.js" type="text/javascript"></script>
    <script src="../CCMobile/Todolist.js" type="text/javascript"></script>
    <script src="../CCMobile/Running.js" type="text/javascript"></script>
    <script src="Apps.js"></script>
    <script src="Search.js" type="text/javascript"></script>
    <script src="//res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
    <script src="http://res2.wx.qq.com/open/js/jweixin-1.6.0.js"></script>

    <style type="text/css">
        /*body{
            font-size:15px;
        }*/
        .au-grid-box {
            display: -webkit-flex;
            display: inline-flex;
            justify-content: flex-start;
            font-size: 0.55rem;
            color: #222222;
            margin-top: 0.5rem;
            flex-wrap: wrap;
        }

        .au-grid {
            display: flex;
            flex-direction: column;
            align-items: center;
            padding: 0.5rem;
            width: 4.3rem;
            height: 3.7rem;
            margin-right: 0.35rem;
            text-align:center;
        }

            .au-grid img {
                width: 1.5rem;
                height: 1.5rem;
                /*margin-bottom: 0.3rem;*/
            }

        .mui-padding {
            top: 3px !important;
            margin-left: -20px !important;
        }

        .mui-table-view:before {
            height: 0px;
        }

        .mui-backdrop {
            bottom: 167px;
        }
        /* 折叠面板初始化隐藏 */
        .item_wrap {
            padding: 0.25rem 0;
            border-top: 1px solid #ececec;
        }

        .item_wrap_box {
            display: flex;
            flex-direction: column;
        }

            .item_wrap_box > div {
                display: flex;
                /* align-items: center; */
                padding-left: 29px;
                font-size: 14px;
            }

                .item_wrap_box > div > div:first-of-type {
                    color: #333;
                }

                .item_wrap_box > div > div:last-of-type {
                    color: #666;
                    flex: 1;
                }

                .item_wrap_box > div:first-of-type {
                    padding-left: 0;
                }

                    .item_wrap_box > div:first-of-type > span {
                        width: 24px;
                        margin-right: 5px;
                        color: #FF6619;
                    }

                    .item_wrap_box > div:first-of-type > div {
                        font-size: 0.75rem;
                        color: #212121;
                        font-weight: bold;
                    }

        /* 分享弹窗 */
        .mask {
            width: 100%;
            height: 100%;
            background: rgba(0,0,0,0.2);
            position: fixed;
            top: 0;
            left: 0;
            display: none;
        }

            .mask .content {
                position: absolute;
                bottom: 50px;
                width: 100%;
                background: rgba(255,255,255,1);
                border-radius: 0.4rem 0.4rem 0 0;
            }

                .mask .content .title {
                    font-size: 0.44rem;
                    text-align: center;
                    margin-top: 0.6rem;
                }

            .mask .share-box {
                display: flex;
                justify-content: space-between;
                margin-top: 0.8rem;
                margin-bottom: 0.6rem;
                text-align: center;
            }

            .mask .share-text {
                margin-top: 0.14rem;
                font-size: 0.38rem;
            }

        .share {
            width: 35%;
            margin: auto;
        }

        .line {
            width: 90%;
            height: 0.02rem;
            background: rgba(234,234,234,1);
            margin: auto;
        }

        .fail-btn {
            font-size: 0.42rem;
            font-weight: 400;
            text-align: center;
            padding: 0.4rem 0;
        }
        .mui-control-content {
            position: unset ;
        }
        .mui-table-view:first-child {
            margin-top: 15px;
        }

        .mui-page .mui-table-view:last-child {
            margin-bottom: 30px;
        }

        .mui-table-view {
            margin-top: 20px;
        }

        .mui-table-view span.mui-pull-right {
            color: #999;
        }

        .mui-table-view-divider {
            background-color: #efeff4;
            font-size: 14px;
        }

        .mui-table-view-divider:before,
        .mui-table-view-divider:after {
            height: 0;
        }

    </style>
    <script type="text/javascript">
        mui.plusReady(function () {
            ws = plus.webview.currentWebview();
            //关闭splash页面；
            plus.navigator.closeSplashscreen();
        })

        var flowNo; //流程编号
        var flow;//流程属性
        var webUser = new WebUser();
        //初始化页面数据
        $(function () {
            window.location.href = './SaaS/Home.htm';
            return;

            var doType = GetQueryString("DoType");
            if (doType == null || doType == undefined || doType == "")
                doType = "home";

            //首页
            if (doType == "home") {
                $("#home").addClass("mui-active");
                $("#todolist").removeClass("mui-active");
                $("#search").removeClass("mui-active");
                $("#setting").removeClass("mui-active");

                $("#tabbar").addClass("mui-active");
                $("#tabbar-with-todolist").removeClass("mui-active");
                $("#tabbar-with-search").removeClass("mui-active");
                $("#tabbar-with-set").removeClass("mui-active");
                $("#tabbar-with-running").removeClass("mui-active");

                Home_InitPage();
            }
            //待办
            if (doType == "todolist") {
                $("#home").removeClass("mui-active");
                $("#todolist").addClass("mui-active");
                $("#search").removeClass("mui-active");
                $("#setting").removeClass("mui-active");

                $("#tabbar").removeClass("mui-active");
                $("#tabbar-with-todolist").addClass("mui-active");
                $("#tabbar-with-search").removeClass("mui-active");
                $("#tabbar-with-set").removeClass("mui-active");
                $("#tabbar-with-running").removeClass("mui-active");
                Todolist_InitPage();
            }
            //我发起的流程
            if (doType == "Draf" || doType == "Running" || doType == "Complete") {

                $("#home").addClass("mui-active");
                $("#todolist").removeClass("mui-active");
                $("#search").removeClass("mui-active");
                $("#setting").removeClass("mui-active");

                $("#tabbar").removeClass("mui-active");
                $("#tabbar-with-todolist").removeClass("mui-active");
                $("#tabbar-with-search").removeClass("mui-active");
                $("#tabbar-with-set").removeClass("mui-active");
                $("#tabbar-with-running").addClass("mui-active");
                Running_InitPage(doType);
            }
            if (doType == "search") {
                $("#home").removeClass("mui-active");
                $("#todolist").removeClass("mui-active");
                $("#search").addClass("mui-active");
                $("#setting").removeClass("mui-active");
                $("#tabbar").removeClass("mui-active");

                $("#tabbar-with-todolist").removeClass("mui-active");
                $("#tabbar-with-search").addClass("mui-active");
                $("#tabbar-with-set").removeClass("mui-active");
                $("#tabbar-with-running").removeClass("mui-active");
                Search_InitPage();
            }
            if (doType == "setting") {
                $("#home").removeClass("mui-active");
                $("#todolist").removeClass("mui-active");
                $("#search").addClass("mui-active");
                $("#setting").removeClass("mui-active");
                $("#tabbar").removeClass("mui-active");

                $("#tabbar-with-todolist").removeClass("mui-active");
                $("#tabbar-with-search").addClass("mui-active");
                $("#tabbar-with-set").removeClass("mui-active");
                $("#tabbar-with-running").removeClass("mui-active");

                Setting_InitPage();
            }

            mui('.mui-scroll-wrapper').scroll({
                scrollY: true, //是否竖向滚动
                scrollX: false, //是否横向滚动
                startX: 0, //初始化时滚动至x
                startY: 0, //初始化时滚动至y
                indicators: true, //是否显示滚动条
                deceleration: 0.0006, //阻尼系数,系数越小滑动越灵敏
                bounce: true //是否启用回弹
            });


            mui('.mui-bar').on('tap', 'a', function () {
                var id = this.id;
                //首页
                if (id == "home") {
                    $("#tabbar").addClass("mui-active");
                    $("#tabbar-with-running").removeClass("mui-active");
                    Home_InitPage();
                }
                //待办
                if (id == "todolist")
                    Todolist_InitPage();
                //查询
                if (id == "search")
                    Search_InitPage();

                //设置
                if (id == "setting") {
                    Setting_Page();
                }
            });

        });

        function Setting_Page() {
            $("#TB_Name").html(webUser.Name);
            $("#TB_OrgName").html(webUser.OrgName);
            var emp = new Entity("BP.Port.Emp");
            emp.No = webUser.OrgNo + "_" + webUser.No;
            emp.PKVal = emp.No;
            emp.Retrieve();
            $("#TB_Tel").html(emp.Tel);
            $("#TB_Email").html(emp.Email);
            var handler = new HttpHandler("BP.Cloud.HttpHandler.App_Portal");
            handler.AddPara("UserID", webUser.No);
            var data = handler.DoMethodReturnString("User_OrgNos");
            if (data.indexOf('err@') != -1) {
                mui.alert(data);
                return;
            }
            data = JSON.parse(data);
            var _html = "";
            data.forEach(function (org) {
                if (org.No == webUser.OrgNo)
                    _html += '<li class="mui-table-view-cell mui-selected" data-info="' + org.No + '">';
                else
                    _html += '<li class="mui-table-view-cell" data-info="' + org.No + '">';
                _html += '<a class="mui-navigate-right">';
                _html += org.Name;
                _html += '</a>';
                _html += '</li>';
            })
            $("#Orgs").html(_html);
            document.querySelector('.mui-table-view.mui-table-view-radio').addEventListener('selected', function (e) {
                var orgNo = $(e.detail.el).attr("data-info");
                //改变组织
                var handler = new HttpHandler("BP.Cloud.HttpHandler.App_Portal");
                handler.AddPara("UserID", webUser.No);
                handler.AddPara("OrgNo", orgNo);
                var data = handler.DoMethodReturnString("User_ChangeOrg");
                if (data.indexOf("err@") != -1) {
                    mui.alert(data);
                    return;
                }
                Setting_Page();
            });
        }
        function Home_InitPage() {


            //修改微信的名字，因为使用接口获取不到名字.
           
            if (webUser.No === webUser.Name || webUser.Name == "") {
                while (true) {
                    if (webUser.No == "admin")
                        break;

                    var val = promptGener('初次登陆，您的姓名:', webUser.No);
                    if (val == null || val == undefined || val == webUser.Name) {
                        continue;
                    }

                    var handler = new HttpHandler("BP.WF.HttpHandler.CCMobilePortal_SaaS");
                    handler.AddPara("Name", val);
                    var data = handler.DoMethodReturnString("Home_EditUserName");
                    webuser.Name = val;
                    break;
                }
            }

            //修改部门名称.
            if (webUser.FK_DeptName == webUser.FK_Dept || webUser.FK_DeptName == '' || webUser.FK_DeptName == null) {
                while (true) {

                    var val = promptGener('初次登陆，您的部门/科室名字:', "xx部/科");
                    if (val == null || val == undefined || val == "xx部/科") {
                        continue;
                    }

                    var handler = new HttpHandler("BP.WF.HttpHandler.CCMobilePortal_SaaS");
                    handler.AddPara("Name", val);
                    var data = handler.DoMethodReturnString("Home_EditDeptName");
                    webuser.FK_DeptName = val;
                    break;
                }
            }


            //1.选项卡的操作 3.我发起的流程（包含草稿，处理中，已完成）
            var handler = new HttpHandler("BP.WF.HttpHandler.CCMobilePortal_SaaS");
            var data = handler.DoMethodReturnString("Home_Init");
            if (data.indexOf("err@") != -1)
                mui.alert(data);
            else {
                data = JSON.parse(data);
                $("#EmpWorks_Count").html(data.Todolist_EmpWorks);
                $("#Draft_Count").html(data.Todolist_Draft);
                $("#Runing_Count").html(data.MyStart_Runing);
                $("#Complete_Count").html(data.MyStart_Complete);
            }
            //2.根据用户登陆名称获取近期使用过的流程
            GetUesFlow();
            //4.显示流程列表
            ShowStartFlowList();

            //触发含有class au-grid的div时，发起流程
            $(".au-grid").on("tap", function () {
                flowNo = $(this).attr("data-info");
                flow = new Entity("BP.WF.Flow", flowNo);
                if (flow.IsStartInMobile == "0") {
                    mui.alert("现在暂时不支持移动端发起，如有需要请联系管理员启用该流程")
                    return;
                }
                if (flow.GuestFlowRole != 1) {
                    var url = "../CCMobile/MyFlow.htm?FK_Flow=" + $(this).attr("data-info") + "&MyFlowFrom=home&m=" + Math.random();
                    SetHref(url);
                    return;
                } else {
                    openShareModal();
                }

            });
            $("#WeiXin").on("tap", function () {
                ShareWeiXin();
            });
        }


        //唤起弹窗
        function openShareModal() {
            $(".mask .content").css("bottom", "-6rem");
            $(".mask").show();
            $(".mask .content").animate({ bottom: "50px" });
        }
        //关闭弹窗
        function closeShareModal() {
            $(".mask .content").animate({ bottom: "-6rem" });
            $('.mask').delay(400).hide(1);
        }


        /**
         * 最近使用过的流程
         */
        function GetUesFlow() {
            var _html = "";
            $("#UseFlow").html("");
            var handler = new HttpHandler("BP.WF.HttpHandler.CCMobilePortal_SaaS");
            var data = handler.DoMethodReturnString("GetUseFlowByUserNo");
            if (data.indexOf("err@") != -1) {
                mui.alert(data);
                return;
            }


            data = JSON.parse(data);
            $.each(data, function (i, item) {

                var iconObj = new Object();
                if (item.ICON != undefined && item.ICON.indexOf('@') >= 0) { //包含@符号，是按照规则组装的数据
                    iconObj = item.ICON.split("@");
                }
                _html = '<div class="au-grid"  data-info="' + item.FK_Flow + '">';
                _html += '<div >';
                _html += "<img src = '/App/FlowDesigner/FlowIcon/" + (iconObj == undefined ? "" : iconObj[0]) + ".png' class='" + (iconObj == undefined ? "" : iconObj[1]) + "' onerror=\"nofind();\" ' />";
                _html += '</div>';
                _html += '<div>' + item.FlowName + '</div>';
                _html += '</div>';
                $("#UseFlow").append(_html);
            });

        }
        /**
         * 显示能发起的流程列表
         */
        function ShowStartFlowList() {
            var handler = new HttpHandler("BP.Cloud.HttpHandler.App");
            var data = handler.DoMethodReturnString("Start_Init");
            if (data.indexOf('err@') == 0) {
                mui.alert(data);
                return;
            }
            data = JSON.parse(data);
            var Sort = data.Sort,
                Start = data.Start;
            $("#FlowList").html("");
            Sort.forEach(function (sort) {
                if (sort.Name == "" || sort.Name == null)
                    return;
                var _html = "";
                var html = "";
                var isHaveFlow = false;
                Start.forEach(function (item) {

                    if (item.FK_FlowSort == sort.No) {
                        var iconObj = new Object();
                        if (item.ICON != null && item.ICON!=undefined&&item.ICON.indexOf('@') >= 0) { //包含@符号，是按照规则组装的数据
                            iconObj = item.ICON.split("@");
                        }
                        _html += '<div class="au-grid" style="" data-info="' + item.No + '">';
                        _html += '<div >';
                        _html += "<img src = '/App/FlowDesigner/FlowIcon/" + (iconObj == undefined ? "" : iconObj[0]) + ".png' class='" + (iconObj == undefined ? "" : iconObj[1]) + "' onerror=\"nofind();\" ' />";
                        _html += '</div>';
                        _html += '<div>' + item.Name + '</div>';
                        _html += '</div>';
                        isHaveFlow = true;

                    }

                });
                if (isHaveFlow) {
                    html = '<li class="mui-table-view-cell mui-media">';
                    html += '<div style="margin-bottom:0.5rem">';
                    html += '<div><span style="padding: 0.28rem;font-weight: bold;">' + sort.Name + '</span></div>';
                    html += '<div class="au-grid-box">';
                    html += _html;
                    html += '</div>';
                    html += '</div>';
                    html += '</li>';
                    $("#FlowList").append(html);
                }

            });
        }

        function ToUrl(doType) {
            Running_InitPage(doType);
            $("#tabbar").removeClass("mui-active");
            $("#tabbar-with-running").addClass("mui-active");
        }
        function nofind() {
            var img = event.srcElement;
            img.src = "/App/FlowDesigner/AppTemplate/DefaultIcon.png";
        }
        var webUser = new WebUser();
        //自定义转发到分享到微信
        function ShareWeiXin() {
            var flow = new Entity("BP.WF.Flow", flowNo);
            var handler = new HttpHandler("BP.WF.HttpHandler.CCMobilePortal_SaaS");
            var data = handler.DoMethodReturnString("JS_SDK_Signature");
            if (data.indexOf("err@") != -1) {
                mui.alert(data);
                return;
            }
            data = JSON.parse(data);
            wx.config({
                debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
                appId: data.AppID, // 必填，公众号的唯一标识
                timestamp: data.timestamp, // 必填，生成签名的时间戳
                nonceStr: data.nonceStr, // 必填，生成签名的随机串
                signature: data.signature,// 必填，签名
                jsApiList: ['shareWechatMessage', 'ShareTimelineMessage'] // 必填，需要使用的JS接口列表
            });
           
           var redirect_uri = "http://eyer.ccflow.org/CCMobilePortal/MyFlowShare.htm";//获取页面的链接
           redirect_uri = encodeURIComponent(redirect_uri)
            //页面链接需要使用网页授权获取用户信息
            var path = "https://open.weixin.qq.com/connect/oauth2/authorize?appid=wx5c371647cecd1db2&redirect_uri=" + redirect_uri + "&response_type=code&scope=snsapi_userinfo&state=FlowNo_"+flow.No+"|OrgNo_"+webUser.OrgNo+"#wechat_redirect";

            wx.ready(function () {   //需在用户可能点击分享按钮前就先调用
                wx.ready(function () {   //需在用户可能点击分享按钮前就先调用
                    wx.invoke(
                        "shareWechatMessage", {
                        title: flow.Name, // 分享标题
                        desc: '外部用户发起流程', // 分享描述
                        link: path,
                        imgUrl: '', // 分享图标
                    }, function (res) {
                        if (res.err_msg == "shareWechatMessage:ok") {
                           
                        }
                    }
                    );

                });
            });
        }
        //自定义转发到会话
        function ShareWeiXinQuan() {
            var flow = new Entity("BP.WF.Flow", flowNo);
            var handler = new HttpHandler("BP.WF.HttpHandler.CCMobilePortal_SaaS");
            var data = handler.DoMethodReturnString("JS_SDK_Signature");
            if (data.indexOf("err@") != -1) {
                mui.alert(data);
                return;
            }
            data = JSON.parse(data);
            wx.config({
                debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
                appId: data.AppID, // 必填，公众号的唯一标识
                timestamp: data.timestamp, // 必填，生成签名的时间戳
                nonceStr: data.nonceStr, // 必填，生成签名的随机串
                signature: data.signature,// 必填，签名
                jsApiList: ['shareWechatMessage', 'shareAppMessage'] // 必填，需要使用的JS接口列表
            });

            var redirect_uri = "http://www.ccbpm.cn/CCMobilePortal/MyFlowShare.htm";//获取页面的链接
            redirect_uri = encodeURIComponent(redirect_uri)
            //页面链接需要使用网页授权获取用户信息
            var path = "https://open.weixin.qq.com/connect/oauth2/authorize?appid=wx5c371647cecd1db2&redirect_uri=" + redirect_uri + "&response_type=code&scope=snsapi_userinfo&state=FlowNo_" + flow.No + "|OrgNo_" + webUser.OrgNo + "Type_Flow#wechat_redirect";

            wx.ready(function () {   //需在用户可能点击分享按钮前就先调用
                wx.ready(function () {   //需在用户可能点击分享按钮前就先调用
                    wx.invoke(
                        "shareAppMessage", {
                        title: flow.Name, // 分享标题
                        desc: '外部用户发起流程', // 分享描述
                        link: path,
                        imgUrl: '', // 分享图标
                    }, function (res) {
                        if (res.err_msg == "shareWechatMessage:ok") {

                        }
                    }
                    );

                });
            });
        }
    </script>
</head>
<body>
    <!--header-->
    <!--<header class="mui-bar mui-bar-nav">
        <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
        <h1 class="mui-title">首页</h1>
    </header>-->
    <!--底部-->
    <nav class="mui-bar mui-bar-tab">
        <a class="mui-tab-item mui-active" href="#tabbar" id="home">
            <span class="mui-icon mui-icon-paperplane"></span>
            <span class="mui-tab-label">发起</span>
        </a>
        <a class="mui-tab-item" href="#tabbar-with-todolist" id="todolist">
            <span class="mui-icon mui-icon-email"><span class="mui-badge" id="EmpWorks_Count">0</span></span>
            <span class="mui-tab-label">待办</span>
        </a>
        <a class="mui-tab-item" href="#tabbar-with-search" id="search">
            <span class="mui-icon mui-icon-search"></span>
            <span class="mui-tab-label">查询</span>
        </a>
        <a class="mui-tab-item" href="#tabbar-with-set" id="setting">
            <span class="mui-icon mui-icon-gear"></span>
            <span class="mui-tab-label">设置</span>
        </a>
        <!--此功能未实现，暂时隐藏-->
        <!--
    <a class="mui-tab-item" href="#tabbar-with-set" id="setting">
        <span class="mui-icon mui-icon-gear"></span>
        <span class="mui-tab-label">应用</span>
    </a>
    -->
    </nav>
    <div class="mui-content mui-scroll-wrapper" id="scroll">
        <!-- 首页 -->
        <div id="tabbar" class="mui-control-content mui-active">
            
            <div class="mui-content">
                <!--近期使用过的流程-->
                <div class="title" style="height:0.7rem"></div>
                <ul class="mui-table-view" style="padding-bottom:0.5rem">
                    <li class="mui-table-view-cell mui-media">
                        <div><span style="padding: 0.28rem;font-weight: bold;">近期使用过的</span></div>
                        <div class="au-grid-box" id="UseFlow"></div>
                    </li>
                </ul>
                <!--我发起的流程-->
                <div class="title" style="height:0.7rem"></div>
                <div style="background-color:white;padding-left:1.05rem;padding-top:0.7rem"><span style="padding: 0.28rem;font-weight: bold;">我发起的</span></div>
                <ul class="mui-table-view mui-grid-view mui-grid-12">
                    <li class="mui-table-view-cell mui-media mui-col-xs-3 mui-col-sm-2" style="margin-right: 28px;display:table-cell;">
                        <a href="javaScript:ToUrl('Draf');">
                            <span class="mui-icon mui-icon-list">
                                <span class="mui-badge mui-padding" id="Draft_Count"  style="left:90%">0</span>
                            </span>
                            <div class="mui-media-body" style="font-size:12px">草稿</div>
                        </a>
                    </li>
                    <li class="mui-table-view-cell mui-media mui-col-xs-3 mui-col-sm-2" style="margin-right: 28px;display: table-cell;">
                        <a href="javaScript:ToUrl('Running');">
                            <span class="mui-icon mui-icon-loop">
                                <span class="mui-badge mui-padding" id="Runing_Count" style="left:90%">0</span>
                            </span>
                            <div class="mui-media-body" style="font-size:12px">未完成</div>
                        </a>
                    </li>
                    <li class="mui-table-view-cell mui-media mui-col-xs-3 mui-col-sm-2" style="margin-right: 28px; display: table-cell;">
                        <a href="javaScript:ToUrl('Complete');">
                            <span class="mui-icon mui-icon-paperplane">
                                <span class="mui-badge mui-padding" id="Complete_Count"  style="left:90%">0</span>
                            </span>
                            <div class="mui-media-body" style="font-size:12px">已完成</div>
                        </a>
                    </li>
                </ul>
                <!--流程列表-->
                <div class="title" style="height:0.7rem"></div>
                <ul class="mui-table-view" id="FlowList"></ul>
            </div>
        </div>

        <!--待办-->
        <div id="tabbar-with-todolist" class="mui-control-content">
            <section class="mui-content">
                <div class="au-bg-white">
                    <div id="segmentedControl" class="mui-segmented-control mui-segmented-control-inverted mui-segmented-control-primary">
                        <a class="mui-control-item tab-item mui-active" id="todolist" href="#item_todolist" data-index="0">
                            待办<span class="mui-badge mui-badge-danger au-m-l-8" id="Todolist_EmpWorks">0</span>
                        </a>
                        <a class="mui-control-item tab-item" id="running" href="#item_running" data-index="1">
                            未完成<span class="mui-badge mui-badge-danger au-m-l-8" id="Todolist_Runnings">0</span>
                        </a>
                        <a class="mui-control-item tab-item" id="running" href="#item_complete" data-index="1">
                            已完成<span class="mui-badge mui-badge-danger au-m-l-8" id="Todolist_Completes">0</span>
                        </a>
                        <a class="mui-control-item tab-item" id="complete" href="#item_cc" data-index="2">
                            抄送<span class="mui-badge mui-badge-danger au-m-l-8" id="Todolist_CCs">0</span>
                        </a>
                    </div>
                </div>
                <div class="tab-box">
                    <!--待办-->
                    <div id="item_todolist" class="mui-control-content  mui-active">
                        <div class="mui-scroll-wrapper" style="margin-top:40px">
                            <div class="mui-scroll" id="item_todolistData">
                            </div>
                        </div>
                    </div>
                    <!--已处理-->
                    <div id="item_running" class="mui-control-content">
                        <div class="mui-scroll-wrapper" style="margin-top:40px">
                            <div class="mui-scroll" id="item_runningData">
                            </div>
                        </div>
                    </div>
                    <!--已处理-->
                    <div id="item_complete" class="mui-control-content">
                        <div class="mui-scroll-wrapper" style="margin-top:40px">
                            <div class="mui-scroll" id="item_completeData">
                            </div>
                        </div>
                    </div>
                    <!--抄送给我的-->
                    <div id="item_cc" class="mui-control-content">
                        <div class="mui-scroll-wrapper" style="margin-top:40px">
                            <div class="mui-scroll" id="item_ccData">
                            </div>
                        </div>
                    </div>
                </div>
            </section>
        </div>

        <!--我发起的流程-->
        <div id="tabbar-with-running" class="mui-control-content">
            <section class="mui-content">
                <div class="au-bg-white">
                    <div id="segmentedControl" class="mui-segmented-control mui-segmented-control-inverted mui-segmented-control-primary">
                        <div id="segmentedControl" class="mui-segmented-control mui-segmented-control-inverted mui-segmented-control-primary">
                            <a class="mui-control-item tab-item" id="myRunning" href="#item_my_running" data-index="1">
                                未完成
                            </a>
                            <a class="mui-control-item tab-item" id="myComplete" href="#item_my_complete" data-index="2">
                                已完成
                            </a>
                            <a class="mui-control-item tab-item" id="draflist" href="#item_my_draflist" data-index="0">
                                草稿
                            </a>
                        </div>
                    </div>
                </div>
                <div class="tab-box">
                    <!--未完成-->
                    <div id="item_my_running" class="mui-control-content">
                        <div class="mui-scroll-wrapper" style="margin-top:40px">
                            <div class="mui-scroll" id="item_my_runningData">
                            </div>
                        </div>
                    </div>
                    <!--已完成-->
                    <div id="item_my_complete" class="mui-control-content">
                        <div class="mui-scroll-wrapper" style="margin-top:40px">
                            <div class="mui-scroll" id="item_my_completeData">
                            </div>
                        </div>
                    </div>
                    <!--草稿-->
                    <div id="item_my_draflist" class="mui-control-content">
                        <div class="mui-scroll-wrapper" style="margin-top:40px">
                            <div class="mui-scroll" id="item_my_draflistData">
                            </div>
                        </div>
                    </div>
                </div>
            </section>
        </div>
        <!--查询页面-->
        <div id="tabbar-with-search" class="mui-control-content">
           
            <div>
                <!--Search查询框-->
                <div class="mui-input-row mui-search" style="margin:5px;float:left;width:85%">
                    <input type="search" id="SearchKey" class="mui-input-clear" placeholder="" style="background-color:white">
                </div>
                <!--条件筛选框-->
                <div class="" style="margin-top:8px;float:left;">
                    <a id="offCanvasBtn" class="mui-icon mui-action-menu mui-icon-bars " style="color:#8F8F94"></a>
                </div>
                <div style="clear:both"></div>
            </div>
            <div class="tab-box">
                <div class="mui-scroll-wrapper" style="margin-top:50px">
                    <div class="mui-scroll">
                        <!--处理中-->
                        <div id="datalist" class=""></div>
                    </div>
                </div>
            </div>
        </div>
        <!--查询条件-->
        <div id="tabbar-with-searchCondtion" class="mui-control-content">
            <div class="mui-scroll">
                <section class="screen">
                    <div class="top">筛选</div>
                    <div class="hd">
                        <div class="title">时间段</div>
                        <div class="list1">
                            <input class="button" name="TSPan" id="TSPan_3" type="button" value="全部" onclick="setTSpan(this.value)">
                            <input class="button" name="TSPan" id="TSPan_0" type="button" value="本周" onclick="setTSpan(this.value)">
                            <input class="button" name="TSPan" id="TSPan_1" type="button" value="上周" onclick="setTSpan(this.value)">
                            <input class="button" name="TSPan" id="TSPan_2" type="button" value="上上周" onclick="setTSpan(this.value)">

                        </div>
                    </div>

                    <div class="bd">
                        <div class="title">流程状态</div>
                        <div class="list1">
                            <input class="button" name="WFState" id="WFState_all" type="button" value="全部" onclick="setWFState(this.value)">
                            <input class="button" name="WFState" id="WFState_1" type="button" value="草稿" onclick="setWFState(this.value)">
                            <input class="button" name="WFState" id="WFState_2" type="button" value="运行中" onclick="setWFState(this.value)">
                            <input class="button" name="WFState" id="WFState_3" type="button" value="退回" onclick="setWFState(this.value)">
                            <input class="button" name="WFState" id="WFState_5" type="button" value="完成" onclick="setWFState(this.value)">

                        </div>

                        <div class="title" style="padding-top:4%;">按时间</div>
                        <div class="j">
                            <input class="txt" placeholder="开始时间" type="text">
                            <input class="txt" placeholder="结束时间" type="text">
                            <div class="line"></div>
                        </div>

                    </div>

                    <div class="ft">

                        <input class="submit" type="submit" value="确定" id="offCanvasHide">
                        <input class="reset" type="reset" value="重置" id="Reset">

                    </div>


                </section>


            </div>
        </div>
        <div id="tabbar-with-set" class="mui-control-content">
            <div class="mui-navbar-inner mui-bar mui-bar-nav">
                <!--<button type="button" class="mui-right mui-btn  mui-btn-link mui-btn-nav mui-pull-right">
                    确定
                </button>-->
                <h1 class="mui-center mui-title">个人信息</h1>
            </div>
            <div class="mui-page-content">
                <div class="mui-scroll-wrapper" style="top:45px">
                    <div class="mui-scroll">
                        <ul class="mui-table-view">
                            <li class="mui-table-view-cell">
                                <a>姓名<span class="mui-pull-right" id="TB_Name"></span></a>
                            </li>
                            <li class="mui-table-view-cell">
                                <a>所属企业<span class="mui-pull-right" id="TB_OrgName"></span></a>
                            </li>
                        </ul>
                        <ul class="mui-table-view">
                            <li class="mui-table-view-cell">
                                <a>手机号<span class="mui-pull-right" id="TB_Tel"></span></a>
                            </li>
                            <li class="mui-table-view-cell">
                                <a>邮箱地址<span class="mui-pull-right" id="TB_Email"></span></a>
                            </li>
                        </ul>
                        <h5 class="mui-content-padded">切换组织</h5>
                        <ul class="mui-table-view  mui-table-view-radio" id="Orgs"></ul>
                    </div>
                </div>
            </div>
        </div>
        <div class="mask">
            <div class="content">
                <div class="title">请选择分享方式</div>
                <div class="share-box">
                    <div onclick="ShareWeiXin()" style="text-align:right"><img src="imgs/weixin.png" class="share"><div class="share-text">微信</div></div>
                    <div onclick="ShareWeiXinQuan()" style="text-align:left"><img src="imgs/wxq.png" class="share"><div class="share-text">朋友圈</div></div>
                </div>
                <div class="line"></div>
                <div class="fail-btn" onclick="closeShareModal()">取消</div>
            </div>
        </div>
    </div>
    
</body>
</html>
